<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<div th:replace="dashboard/header :: header"></div>

<body id="page-top">

	<style type="text/css">
		.layui-layer-btn a {
			height: 35px;
			line-height: 35px;
			margin: 0px 5px 0;
			padding: 0 15px;
			border: 1px solid #dedede;
			background-color: #fff;
			color: #333;
			border-radius: 2px;
			font-weight: 400;
			cursor: pointer;
			text-decoration: none;
		}
		.layui-layer-btn layui-layer-btn-{
			background-color:#f5f5f5;	
		}
	</style>
	<div id="wrapper">

		<div id="content-wrapper">
		
			<div class="col-sm-12">
				<ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
					<li class="nav-item">	
						<a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">健康检查</a>
					</li>
					<li class="nav-item">
						<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">任务管理(feature)</a>
					</li>
				</ul>
			</div>
			
			<div class="col-sm-12">
				<div class="tab-content" id="pills-tabContent">
				
					<!-- 虚拟机申请管理_start -->	
					<div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">
						<div class="container-fluid" style="padding: 0px;">

							<ol class="breadcrumb">
								<li class="breadcrumb-item"><a href="#">资源健康检查管理</a></li>
							</ol>

							<form class="form-inline" id="trainingSearchForm">
								<div class="input-group mb-2 mr-sm-2">
									<select name="condition[masterCode]" style="width: 200px"
										id="inputState" class="form-control">
										<option th:each="m:${schools}" th:text="${m.masterName}" th:value="${m.masterCode}"></option>
									</select>
								</div>
								<label class="sr-only" for="inlineFormInputName2">Name</label> <input
									type="text" class="form-control mb-2 mr-sm-2" id="orderId"
									name="condition[headthJob|like]" placeholder="检查项"> <label
									class="sr-only" for="inlineFormInputGroupUsername2">Username</label>

								<button type="button" onclick="search(this)" class="btn btn-primary mb-2">搜索</button>
								&nbsp;&nbsp;
								<button type="button" onclick="add()" class="btn btn-primary mb-2">添加</button>
								
								<button type="button" style="position: absolute; right: 85px;" onclick="importData()" class="btn btn-primary mb-2">导入</button>
								<button type="button" style="position: absolute; right: 20px;" onclick="exportData()" class="btn btn-primary mb-2">导出</button>
							</form>
							<div class="span12">
								<div class="table-responsive">
									<table class="table table-bordered" id="headthDataTable" width="100%" cellspacing="0">
										<thead>
											<tr>
												<th style="width: 150px">所属机房</th>
												<th >检查项目</th>
												<th >类型</th>
												<th >检查地址</th>
												<th width="60px">状态</th>
												<th width="150px">检查时间</th>
												<th width="150px">操作</th>
											</tr>
										</thead>
										<tbody>
										</tbody>
										<footer>
											<tr>
												<th style="width: 150px">所属机房</th>
												<th >检查项目</th>
												<th >类型</th>
												<th >检查地址</th>
												<th width="90px">状态</th>
												<th width="200px">检查时间</th>
												<th width="200px">操作</th>
											</tr>
										</footer>
									</table>
								</div>
							</div>
						</div>
					</div>	
					<!-- 虚拟机申请管理_end -->	
					
					<!-- 数据库申请管理_start -->	
					<div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">
						<div class="container-fluid" style="padding: 0px;">
							<ol class="breadcrumb">
								<li class="breadcrumb-item"><a href="#">定时任务监控管理</a></li>
							</ol>
							<form class="form-inline">
								<div class="input-group mb-2 mr-sm-2">
									<select name="condition[masterCode]" style="width: 200px"
										id="inputState" class="form-control">
										<option th:each="m:${schools}" th:text="${m.masterName}" th:value="${m.masterCode}"></option>
									</select>
								</div>
								<label class="sr-only" for="inlineFormInputName2">Name</label> <input
									type="text" class="form-control mb-2 mr-sm-2" id="orderId"
									name="condition[orderId|like]" placeholder="订单号"> <label
									class="sr-only" for="inlineFormInputGroupUsername2">Username</label>

								<div class="input-group mb-2 mr-sm-2">
									<select name="condition[sendStatus]" id="inputState"
										class="form-control">
										<option value="">状态</option>
										<option value="01">未接单</option>
										<option value="02">已接单</option>
										<option value="04">已签收</option>
										<option value="05">订单超时</option>
									</select>
								</div>
								<button type="button" onclick="search(this)" class="btn btn-primary mb-2">搜索</button>
									
								&nbsp;&nbsp;
								<button type="button" onclick="addDb()" class="btn btn-primary mb-2"> 添加</button>
									
							</form>
							<div class="span12">
								<div class="table-responsive">
									<table class="table table-bordered" id="databaseDataTable" width="100%"
										cellspacing="0">
										<thead>
											<tr>
												<th style="width: 150px">所属机房</th>
												<th width="100px">用户名</th>
												<th width="400px">使用描述</th>
												<th>申请源</th>
												<th width="200px">申请时间</th>
												<th width="200px">操作</th>
											</tr>
										</thead>
										<tbody>
										</tbody>
										<footer>
											<tr>
												<th style="width: 150px">所属机房</th>
												<th style="max-width: 200px">用户名</th>
												<th>使用描述</th>
												<th>申请源</th>
												<th>申请时间</th>
												<th>操作</th>
											</tr>
										</footer>
									</table>
								</div>
							</div>
						</div>
					</div>
					<!-- 数据库申请管理_end -->	
				</div>
			</div>
		</div>
	</div>

	<script type="text/javascript">
	
		var columns = [ { data: 'masterCode_label' },
            { data: 'headthJob' },
            { data: 'checkType' },
            { data: 'id' },
            { data: 'hasStatus' },
            { data: 'lastHeadthTime' },
            { data: 'id' }
          ] ; 
		
		var columnDefs = [{
			   "targets" : 1,//操作按钮目标列
			   "data" : null,
			   "render" : function(data, type,row) {
				   var id = row.orderId ; 
				   var html = "<a style='cursor:pointer;float:left' data-id="+id+" data-scope='runman' onclick='sendAll(this)'>"+data+"</a>" ; 
				   return html;
			    }
        	  },
        	  {
				  "render": function(data, type, row) {
					  var id = row.id ;
					  var checkType = row.checkType ;
					  
					  var headthLink = row.headthLink ;
					  var tcpHost = row.tcpHost ;
					  var tcpPort = row.tcpPort ;
					  
					  var html = "" ;
					  if(checkType === 'tcp'){
						html = headthLink ; 
					  }else if(checkType === 'http'){
						html = tcpHost + ":" + tcpPort ; 
					  }
					  return html;
				  },
				  "targets": 3
			  } ,
        	  {
				  "render": function(data, type, row) {
					  var id = row.id ;
					  var html = "" ;
					  if(data === 0){
						html = "<a data-id='"+id+"' style='cursor:pointer' onclick='databaseStatus(this,\"1\")'><i class='fas fa-heartbeat'></i> 正常</a>" ; 
					  }else{
						html = "<a data-id='"+id+"' style='cursor:pointer;' onclick='databaseStatus(this,\"0\")'><i style='color:red' class='fas fa-ambulance'></i> 异常</a>" ; 
					  }
					  return html;
				  },
				  "targets": 4
			  } ,
        	  {
			   "targets" : 6,//操作按钮目标列
			   "data" : null,
			   "render" : function(data, type,row) {
				   var id = row.id ; 
				   var html = "<a style='cursor:pointer' data-id="+id+" onclick='showDetail(this)'><i class='fa fa-leaf'></i> 通过</a>" ; 
				   html += "<a style='cursor:pointer;margin-left:10px;color:red' data-id="+id+" onclick='deleteOrder(this)'><i class='fa fa-trash'></i> 删除</a>" ; 
				   return html;
			   }
		  }]  ; 
		
		$(document).ready(function() {
			datatable("headthDataTable", "/manager/headth_list_data" , columns , columnDefs) ; 
		});
		

		function importData(){
			layer.open({
			  type: 2,
			  title: false,
			  shade: 0.8, 
			  title: '监控项导入',
			  area: ['50%', '40%'],
			  content: ['/manager/headth_import_data', 'yes'], //iframe的url，no代表不显示滚动条
			  end: function(){ 
				 $("#headthDataTable").dataTable().fnDraw(false);
			  }
			});
		}
	
		function add(btn){
			layer.open({
				  type: 2,
				  title: false,
				  shade: 0.8, 
				  title: '添加检查项',
				  area: ['50%', '80%'],
				  content: ['/manager/headth_add', 'yes'], //iframe的url，no代表不显示滚动条
				  end: function(){ 
				     console.log("close") ; 
					 $("#headthDataTable").dataTable().fnDraw(false);
				  }
				});
		}
		
	</script>

</body>

</html>
